<div class="content">
     <h2 class="api-name">引入文件</h2>
     <textarea name="code" class="js"> 
		<script type="text/javascript" src="simpleDrag.js"></script>
	 </textarea>
	 <h2 class="api-name">使用DragAndDrop</h2>
	 <div class="part">
	 	<h3 class="api-guide"><a href="../doc/demo/drag.html" class="demo-btn" target="_blank">运行demo</a>Simple.Drag(opts)</h3>
	 	<div class="desc"><strong>概述：</strong>
	 		Simple.Drag是一个构造函数，可以使一个元素在文档中移动
	 	</div>
	 	<p>启动拖动</p>
	 	<textarea name="code" class="js"> 
	 		$("#test").drag();
	 	</textarea>
	 	<p>销毁拖动事件</p>
	 	<textarea name="code" class="js"> 
	 		$("#test").drag("destroy");
	 	</textarea>
	 	<h3 class="api-guide">SimpleDrag API</h3>
<table class="configList">
	<tr>
		<th width="100">配置选项</th><th width="200">配置选项</th><th>选项说明</th>
	</tr>
	<tr>
		<td>container</td><td>string | dom {default:null}</td><td>设定拖动的范围，可以为jQuery选择器，也可以为一个DOM节点</td>
	</tr>
	<tr>
		<td>proxy</td><td>string | function {default:null}</td><td>设定拖动的代理，可以为一个string，也可以为自定义的函数，注意生成的DOM节点必须添加到body</td>
	</tr>
	<tr>
		<td>direction</td><td>string {default:"both"}</td><td>设定拖动的方向，可选值为"x","y","both"</td>
	</tr>
	<tr>
		<td>handle</td><td>string | dom {default:null}</td><td>设定一个拖动手柄，只会在这个拖动手柄上绑定拖动事件</td>
	</tr>
	<tr>
		<td>iframeFix</td><td>boolean</td><td>开启此选项，在拖动的过程中会创建一个遮罩用于修复鼠标在移动到iframe中失去焦点的问题</td>
	</tr>
	<tr>
		<td>revert</td><td>boolean</td><td>开启此选项，在拖动结束后，被拖动的元素会返回元素原来所在的位置</td>
	</tr>
	<tr>
		<td>delay</td><td>int</td><td>设定拖动延迟开始的像素数，注意这个数字会在x和y方向上同时生效</td>
	</tr>
	<tr>
		<td>atCursor</td><td>array</td><td>设定拖动代理相对鼠标的位置</td>
	</tr>
	<tr>
		<td>grid</td><td>int</td><td>设定每次拖动的距离</td>
	</tr>
	<tr>
		<td>ondragstart</td><td>function(e,drag)</td><td>拖动开始时触发的事件</td>
	</tr>
	<tr>
		<td>ondrag</td><td>function(e,drag)</td><td>拖动过程中触发的事件</td>
	</tr>
	<tr>
		<td>ondragstop</td><td>function(e,drag)</td><td>拖动结束后触发的事件</td>
	</tr>
	<tr>
		<td>dropElements</td><td>string||dom</td><td>指定放置的元素</td>
	</tr>
	<tr>
		<td>ondragenter</td><td>function(dropElement,drag)</td><td>拖动进入时候触发的事件</td>
	</tr>
	<tr>
		<td>ondragleave</td><td>function(dropElement,drag)</td><td>拖动离开时候触发的事件</td>
	</tr>
	<tr>
		<td>ondragdrop</td><td>function(dropElement,drag)</td><td>放置时候触发的事件</td>
	</tr>
</table>
	 </div>
</div>

